<!--
 * @Description: 
 * @Author: charles
 * @Date: 2021-05-05 22:02:56
 * @LastEditors: lk
 * @LastEditTime: 2022-01-10 22:34:02
-->
<template>
  <div ref="bottom2_container" style="height:90%"></div>
</template>
<script>
import { Column } from '@antv/g2plot';

export default{
mounted(){
 this.initChat();
},
methods:{
   initChat(){
     const data = [
  { "date": "2021-1","city": "太原市","value": 44200 },
  { "date": "2021-1","city": "晋中市","value": 24500 },
  { "date": "2021-1","city": "阳泉市","value": 29500 },
  { "date": "2021-4","city": "太原市","value": 7504 },
  { "date": "2021-4","city": "晋中市","value": 17043 },
  { "date": "2021-4","city": "阳泉市","value": 12450 },
  { "date": "2021-7","city": "太原市","value": 84200 },
  { "date": "2021-7","city": "晋中市","value": 44500 },
  { "date": "2021-7","city": "阳泉市","value": 63250 },
  { "date": "2021-10","city": "太原市","value": 64204 },
  { "date": "2021-10","city": "晋中市","value": 63018 },
  { "date": "2021-10","city": "阳泉市","value": 56380 },
  
];
const column = new Column(this.$refs.bottom2_container,{
      data,
      xField: 'date',
      yField: 'value',
      seriesField: 'city',
      isGroup: 'true',
      columnStyle: {
        radius: [20, 20, 0, 0],
      },
    });

    column.render();
}
}
}
</script>